<template>
    <el-dialog title='编辑' :visible.sync="formVisible">  
      <el-form :rules="rules" ref="dataForm" :model="editData" label-position="left" label-width="70px" style=''>           
       <el-form-item :label="$t('table.activity.id')" prop="id">
          <el-input v-model="editData.id"></el-input>
       </el-form-item>           
       <el-form-item :label="$t('table.activity.title')" prop="title">
          <el-input v-model="editData.title"></el-input>
       </el-form-item>     
      <el-form-item :label="$t('table.activity.content')" prop="content">
         <tinymce :height=400 ref="editor" v-model="editData.content"></tinymce> 
      </el-form-item>
       <el-form-item :label="$t('table.activity.createTime')" prop="createTime">
          <el-date-picker v-model="editData.createTime" type="datetime"  value-format="timestamp" placeholder="Please pick createTime">
          </el-date-picker>
       </el-form-item>
       <el-form-item :label="$t('table.activity.expTime')" prop="expTime">
          <el-date-picker v-model="editData.expTime" type="datetime"  value-format="timestamp" placeholder="Please pick expTime">
          </el-date-picker>
       </el-form-item>           
       <el-form-item :label="$t('table.activity.createUserId')" prop="createUserId">
          <el-input v-model="editData.createUserId"></el-input>
       </el-form-item>           
       <el-form-item :label="$t('table.activity.index')" prop="index">
          <el-input v-model="editData.index"></el-input>
       </el-form-item>
       <el-form-item :label="$t('table.activity.startTime')" prop="startTime">
          <el-date-picker v-model="editData.startTime" type="datetime"  value-format="timestamp" placeholder="Please pick startTime">
          </el-date-picker>
       </el-form-item> 
       <el-form-item :label="$t('table.activity.isHot')"><el-select class="filter-item" v-model="editData.isHot" placeholder="Please select isHot">           
           <el-option v-for="item in  isHotMaps" :key="item.value" :label="item.name" :value="item.value">
           </el-option>           
         </el-select>
       </el-form-item>  
      <el-form-item :label="$t('table.activity.img')" prop="img">
           <Upload v-model="editData.img"></Upload>  
      </el-form-item>           
       <el-form-item :label="$t('table.activity.price')" prop="price">
          <el-input v-model="editData.price"></el-input>
       </el-form-item>           
       <el-form-item :label="$t('table.activity.personCount')" prop="personCount">
          <el-input v-model="editData.personCount"></el-input>
       </el-form-item>           
       <el-form-item :label="$t('table.activity.surplusCount')" prop="surplusCount">
          <el-input v-model="editData.surplusCount"></el-input>
       </el-form-item>           
       <el-form-item :label="$t('table.activity.addr')" prop="addr">
          <el-input v-model="editData.addr"></el-input>
       </el-form-item>
       <el-form-item :label="$t('table.activity.bmstartTime')" prop="bmstartTime">
          <el-date-picker v-model="editData.bmstartTime" type="datetime"  value-format="timestamp" placeholder="Please pick bmstartTime">
          </el-date-picker>
       </el-form-item></el-form>  
      <div slot="footer" class="dialog-footer">
        <el-button @click="cancel">{{$t('table.cancel')}}</el-button>       
        <el-button type="primary" @click="update">{{$t('table.confirm')}}</el-button>
      </div>
    </el-dialog>
</template>
<script>
import { activityPatch } from '@/api/activity'
import Upload from '@/components/Upload/singleImage2'
import Tinymce from '@/components/Tinymce'
const isHotMaps = [{ value: 1, name: '是' }, { value: 0, name: '否' }]

export default {
  name: 'activityEditDialog',
  props: ['Visible', 'editData'],
  components: { Tinymce, Upload },
  data() {
    return {
      isHotMaps,
      formVisible: this.Visible,
      rules: {
        id: [{ required: true, message: 'id is required', trigger: 'change' }],
        title: [{ required: true, message: 'title is required', trigger: 'change' }],
        content: [{ required: true, message: 'content is required', trigger: 'change' }],
        createTime: [{ required: true, message: 'createTime is required', trigger: 'change' }],
        expTime: [{ required: true, message: 'expTime is required', trigger: 'change' }],
        createUserId: [{ required: true, message: 'createUserId is required', trigger: 'change' }],
        index: [{ required: true, message: 'index is required', trigger: 'change' }],
        startTime: [{ required: true, message: 'startTime is required', trigger: 'change' }],
        isHot: [{ required: true, message: 'isHot is required', trigger: 'change' }],
        img: [{ required: true, message: 'img is required', trigger: 'change' }],
        price: [{ required: true, message: 'price is required', trigger: 'change' }],
        personCount: [{ required: true, message: 'personCount is required', trigger: 'change' }],
        surplusCount: [{ required: true, message: 'surplusCount is required', trigger: 'change' }],
        addr: [{ required: true, message: 'addr is required', trigger: 'change' }],
        bmstartTime: [{ required: true, message: 'bmstartTime is required', trigger: 'change' }]
      }
    }
  },
  methods: {
    update() {
      console.log(this.editData)
      this.$refs['dataForm'].validate((valid) => {
        if (valid) {
          const tempData = Object.assign({}, this.editData)
          delete tempData.lastLoginTime
          activityPatch(tempData).then(() => {
            // for (const v of this.list) {
            //   if (v.id === this.temp.id) {
            //     const index = this.list.indexOf(v)
            //     this.list.splice(index, 1, this.temp)
            //     break
            //   }
            // }
            this.$emit('hiddenEditDialog')
            this.$notify({
              title: '成功',
              message: '更新成功',
              type: 'success',
              duration: 2000
            })
          })
        }
      })
    },
    cancel() {
      this.$emit('hiddenEditDialog')
    }
  },
  watch: {
    Visible(val) {
      this.formVisible = val
    },
    formVisible(val) {
      if (val === false) {
        this.$emit('hiddenEditDialog')
      }
    }
  }
}
</script>

